import { Component, OnInit } from '@angular/core';
import { AfterViewInit, ViewChild } from '@angular/core';
import { NzFormatEmitEvent, NzTreeNodeOptions } from 'ng-zorro-antd/core';
import { NzTreeComponent } from 'ng-zorro-antd/tree';

@Component({
  selector: 'app-tree1',
  templateUrl: './tree1.component.html',
  styleUrls: ['./tree1.component.css']
})
export class Tree1Component implements OnInit {

  constructor() { }

  ngOnInit() {
  }

  @ViewChild('nzTreeComponent2', { static: false }) nzTreeComponent2: NzTreeComponent;
  @ViewChild('terminal', { static: false }) terminal: NzTreeComponent;
  defaultCheckedKeys = ['10020'];
  defaultSelectedKeys = ['10010'];
  defaultExpandedKeys = ['100', '1001'];

  /**
   * title:标题
   * key:值
   * children:子节点
   * disabled:true 整体无法选中 
   * disableCheckbox:true  复选框无法选中
   * isLeaf:true 叶子节点
   */
  nodes: NzTreeNodeOptions[] = [
    {
      title: 'parent 1',   
      key: '100',
      children: [
        {
          title: 'parent 1-0',
          key: '1001',
          disabled: true,
          children: [                       
            { title: 'leaf 1-0-0', key: '10010', disableCheckbox: true, isLeaf: true },
            { title: 'leaf 1-0-1', key: '10011', isLeaf: true }
          ]
        },
        {
          title: 'parent 1-1',
          key: '1002',
          children: [
            { title: 'leaf 1-1-0', key: '10020', isLeaf: true },
            { title: 'leaf 1-1-1', key: '10021', isLeaf: true }
          ]
        }
      ]
    }
  ];

  nodes2: NzTreeNodeOptions[] = [
    {
      title: '全部终端',   
      key: '100',
      children: [
        {
          title: '终端1',
          key: '1001',
          disabled: true,
          children: [                       
            { title: '分区器1', key: '10010', disableCheckbox: true, isLeaf: true },
            { title: '分区器2', key: '10011', isLeaf: true }
          ]
        },
        {
          title: '终端2',
          key: '1002',
          children: [
            { title: '分区器2', key: '10020', isLeaf: true },
            { title: '分区器3', key: '10021', isLeaf: true }
          ]
        }
      ]
    }
  ];

  nzClick(event: NzFormatEmitEvent): void {
    console.log(event);
  }

  nzCheck(event: NzFormatEmitEvent): void {
    console.log(event);
  }

  // nzSelectedKeys change
  nzSelect(keys: string[]): void {
    // 	获取组件被选中的节点
    console.log(keys, this.nzTreeComponent2.getSelectedNodeList());
  }

  ngAfterViewInit(): void {
    // get node by key: '10011'
    // 	按 key 获取 NzTreeNode 节点
    console.log(this.nzTreeComponent2.getTreeNodeByKey('10011'));
    // use tree methods
    console.log(
      // 获取组件 NzTreeNode 节点
      this.nzTreeComponent2.getTreeNodes(),
      // 获取组件 checkBox 被点击选中的节点
      this.nzTreeComponent2.getCheckedNodeList(),
      // 获取组件被选中的节点
      this.nzTreeComponent2.getSelectedNodeList(),
      // 	获取组件展开状态节点
      this.nzTreeComponent2.getExpandedNodeList()
    );
    this.output()
  }

  // 输出node2
  output(){
    console.log(this.terminal.getTreeNodeByKey('100'))
  }

}
